@extends('backend.layouts.master')
@section('stylies')
<link rel="stylesheet" href="{{asset('admin/backend/nestable/jquery-nestable.css')}}">
<link rel="stylesheet" href="{{asset('admin/backend/bootstrap-select/css/bootstrap-select.min.css')}}">
<style>
    .drag_disabled {
        pointer-events: none;
    }

    .drag_enabled {
        pointer-events: all;
    }

    .h-100,
    .dd {
        height: 100% !important
    }

    .bootstrap-select {
        width: 100% !important;
    }
</style>
@endsection
@section('content')
<div class="container-fluid">
    @if ($errors->any())
        <div class="alert alert-danger">
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif
    <div class="block-header">
        <h2>菜单管理</h2>
    </div>
    <div class="row clearfix">
        <div class="col-xs-12 col-sm-12 col-md-7 col-lg-7">
            <div class="card">
                <div class="header">
                    <h2>
                        菜单列表
                    </h2>
                </div>
                <div class="body h-100">
                    <div class="dd ">
                           @include('backend.menu._child', ['menus' =>$menuList['root'] ?? []])
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-5 com-lg-5">
            <div class="card">
                <div class="header">
                    <h2>
                        添加菜单
                    </h2>
                </div>
                <div class="body h-100">
                    <form action="{{route('admin.menu.store')}}" method="POST">
                        @csrf
                        <label>上级菜单</label>
                        <div class="form-group">
                            <select class="selectpicker" name="parent_id" style="width:100%">
                                <option value="0">顶级菜单</option>
                                @forelse($menus as $menu)
                                    <option value="{{$menu['id']}}">{!! $menu['_name'] !!}</option>
                                    @empty
                                @endforelse
                            </select>
                        </div>
                        <label>菜单名称</label>
                        <div class="form-group">
                            <div class="form-line  @if($errors->has('name')) focused error @endif"> 
                                <input type="text" class="form-control" value="{{old('name')}}" name="name">
                            </div>
                            @if($errors->has('name'))
                                        <span class="text-danger" for="name">{{$errors->first('name')}}</span>
                            @endif
                        </div>
                        <label>菜单链接</label>
                        <div class="form-group @if($errors->has('url')) focused error @endif">
                            <div class="form-line">
                                <input type="text" class="form-control" value="{{old('url')}}" name="url">
                            </div>
                            @if($errors->has('url'))
                                        <span class="text-danger" for="url">{{$errors->first('url')}}</span>
                            @endif
                        </div> 
                        <label>菜单权限</label>
                        <div class="form-group @if($errors->has('slug')) focused error @endif">
                            <div class="form-line">
                                <input type="text" class="form-control" value="{{old('slug')}}" name="slug">
                            </div>
                            @if($errors->has('slug'))
                                        <span class="text-danger" for="slug">{{$errors->first('slug')}}</span>
                            @endif
                        </div> 
                        <label>菜单高亮</label>
                        <div class="form-group @if($errors->has('hightlight_url')) focused error @endif">
                            <div class="form-line">
                                <input type="text" class="form-control" value="{{old('hightlight_url')}}" name="hightlight_url">
                            </div>
                            @if($errors->has('hightlight_url'))
                                        <span class="text-danger" for="hightlight_url">{{$errors->first('hightlight_url')}}</span>
                            @endif
                        </div> 
                        <label>菜单图标</label>
                        <div class="form-group @if($errors->has('icon')) focused error @endif">
                            <div class="form-line">
                                <input type="text" class="form-control" value="{{old('icon')}}" name="icon">
                            </div>
                            @if($errors->has('icon'))
                                        <span class="text-danger" for="icon">{{$errors->first('icon')}}</span>
                            @endif
                        </div> 
                        <label>系统菜单</label>
                        <div class="form-group @if($errors->has('is_system')) focused error @endif">
                                <input type="checkbox" id="basic_checkbox_1" value="1" name="is_system" @if(old('is_system')) checked @endif  />
                                <label for="basic_checkbox_1">系统</label>
                        </div>
                        
                        <label>是否显示</label>
                        <div class="form-group @if($errors->has('is_system')) focused error @endif">
                                <input type="checkbox" id="basic_checkbox_2" value="1" name="status" @if(old('status')) checked @endif  />
                                <label for="basic_checkbox_2">显示</label>
                        </div>
                        <label>状态</label>
                        <div class="form-group @if($errors->has('is_system')) focused error @endif">
                                <input type="checkbox" id="basic_checkbox_3" value="1" name="status" @if(old('status')) checked @endif  />
                                <label for="basic_checkbox_3">启用</label>
                        </div>
                        <button class="btn btn-primary waves-effect" type="submit">提交</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
@endsection

@section('script')
<script src="{{asset('admin/backend/nestable/jquery.nestable.js')}}"></script>
<script>
    $('.dd').nestable({
         /* config options */ 
         handleClass:'drag_disabled'
    });
</script>
<script src="{{asset('admin/backend/bootstrap-select/js/bootstrap-select.min.js')}}"></script>
<script>
    $('.selectpicker').selectpicker();
</script>

@endsection